<template>
	<view class="receive-cargo-content">
		<view style="font-size: 32upx;">
			<text>商品名称：</text>
			<text>{{ detailInfo.product_name }}</text>
		</view>
		<view class="receive-cargo-view">
			<text>物流公司：</text>
			<text>{{ detailInfo.delivery_name }}</text>
		</view>
		<view class="receive-cargo-view">
			<text>物流单号：</text>
			<text>{{ delivery_number }}</text>
		</view>
		<view class="receive-number receive-cargo-view">
			<text>数量：</text>
			<text>{{ detailInfo.need_qty }}</text>
			<text>件</text>
		</view>
		<view class="receive-number receive-cargo-view">
			<text>已收数量：</text>
			<text>{{ detailInfo.received_qty }}</text>
			<text>件</text>
		</view>
		<view class="receive-number receive-cargo-view">
			<text class="cus-title-nowrap">收货数量：</text>
			<input v-model="detailInfo.receive_product_qty" placeholder="收货数量" />
			<text>件</text>
		</view>
		<view class="receive-cargo-view cargo-remark">
			<text class="cus-title-nowrap">备注：</text>
			<input v-model="detailInfo.received_note" placeholder="请输入备注" />
		</view>
		<view><cus-upload-image :imageList="detailInfo.picture_data" imgTitle="相关图片"></cus-upload-image></view>
		<button style="margin-top: 40upx;" type="primary" @click="sendGood">确定</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			msg: '收货',
			wo_material_id: '', // 材料明细行ID
			detailInfo: {}, // 材料详情列表
			numberall: ''
		};
	},
	onLoad(param) {
		this.wo_material_id = parseInt(param.wo_material_id);
		this.getGoodList(parseInt(param.wo_material_id));
	},

	methods: {
		getGoodList(id) {
			uni.request({
				url: this.$store.state.baseUrl + '/lwj/get_work_material_info',
				method: 'POST',
				header: {
					token: this.$store.state.token
				},
				data: {
					wo_material_id: id
				},
				success: res => {
					if (res.data.code === 1) {
						this.detailInfo = res.data.data.info;
					}
				},
				fail: () => {},
				complete: () => {}
			});
		},
		// 修改收货信息
		sendGood() {
			this.numberall = this.detailInfo.need_qty - this.detailInfo.received_qty;
			if (this.detailInfo.receive_product_qty > this.numberall) {
				uni.showToast({
					title: '超出剩余数量',
					mask: false,
					duration: 1500,
					icon: 'none'
				});
			} else {
				if (this.detailInfo.receive_product_qty == null) {
					this.detailInfo.receive_product_qty = 0;
				}
				this.$request({
					url: this.$store.state.baseUrl + '/lwj/get_work_material_write',
					method: 'POST',
					header: {
						token: this.$store.state.token
					},
					data: {
						wo_material_id: this.wo_material_id,
						product_id: this.detailInfo.product_id,
						receive_product_qty: parseFloat(this.detailInfo.receive_product_qty),
						product_qty: this.detailInfo.product_qty,
						received_qty: this.detailInfo.received_qty,
						received_note: this.detailInfo.received_note,
						picture_data: this.detailInfo.picture_data
					},
					success: res => {
						if (res.data.code === 1) {
							this.ReturnSuperiors();
						} else {
							uni.showToast({
								title: res.data.msg,
								icon: 'none',
								duration: 3000
							});
						}
					},
					fail: () => {},
					complete: () => {}
				});
			}
		},
		ReturnSuperiors() {
			uni.navigateBack({
				delta: 1
			});
		},

		//图片预览
		previewImage(url) {
			//有图片的时候才能让他弹出来
			if (url !== '') {
				const imgList = [url];
				uni.previewImage({
					// current: imgList[i],
					current: 0,
					urls: imgList
				});
			} else {
				uni.showToast({
					title: '暂无图片',
					mask: false,
					duration: 1500,
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style scoped>
.receive-cargo-content {
	padding: 20upx 40upx;
	background-color: #ffffff;
	width: 100%;
}

.receive-cargo-content .receive-cargo-view {
	font-size: 32upx;
	height: 80upx;
	line-height: 80upx;
}

.receive-cargo-content view text:nth-of-type(1) {
	color: #8f8f94;
}

.receive-cargo-content view text:nth-child(2) {
	padding-left: 20upx;
}

.cargo-remark,
.receive-number {
	display: flex;
	align-items: center;
}

.receive-number input {
	width: 160upx;
	border-bottom: 2upx solid #8f8f8f;
	text-align: center;
}
</style>
